<template>
  <div
    class="w-full text-center z-1"
    :class="[customClass, { 'left-0 bottom-0 fixed': isFixed }]"
  >
    <div
      class="c-linear-purple flex items-center justify-center flex-wrap h-50 w-full text-white text-16"
      :class="[`rounded-${roundedNum}`]"
      @click="handleConfirm"
    >
      <slot>{{ buttonText }}</slot>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";
const props = defineProps({
  buttonText: {
    type: String,
    default: "立即购买"
  },
  // 是否开启绝对定位
  isFixed: {
    type: Boolean,
    default: false
  },
  // 自定义类名
  customClass: {
    type: String,
    default: ""
  },
  // 圆角值
  roundedNum: {
    type: Number,
    default: 10
  }
});

const emit = defineEmits(["confirm"]);

// 处理点击
const handleConfirm = () => {
  emit("confirm");
};
</script>
